

<div class="bjui-pageHeader">

    <form id="pagerForm" data-toggle="ajaxsearch" action="${request.getContextPath()}/PassRate/passRate" method="post">
        <div class="bjui-searchBar">
            <g:hiddenField name="SYS_QUERY_NAME" value="passRate" />
            <g:hiddenField name="EXPORT_CONTENT_NAME" value="Excel" />
            <label>工序：</label>
            <input type="text" data-rule="required" name="stepDesc" value="${stepDesc}"/>
            <label>作业员：</label>
            <input type="text" data-rule="required" name="zerenren" value="${zerenren}"/>
            <label>处置方法：</label>
            <input type="text" name="czff" value="${czff}"/>
            <label>不良项目：</label>
            <input type="text" name="defectCode" value="${defectCode}"/><br/>
            <label >查询时间段：</label>&nbsp;
            <input type="text" name="startTime" value="${startTime}" data-pattern="yyyy-MM-dd"  data-toggle="datepicker" placeholder="FROM">&nbsp;
            <input type="text" name="endTime" value="${endTime}" data-pattern="yyyy-MM-dd" data-toggle="datepicker" placeholder="TO">&nbsp;&nbsp;

            <button type="submit" class="btn-default" data-icon="search">查询</button>&nbsp;
            <button type="button" class="btn-blue" onclick="javascript:bjuiExportExl('#pagerForm','${request.getContextPath()}/BadProcessAnalysis/exportExcel')" data-icon="file-excel-o" title="导出Excel">导出</button>&nbsp;
        </div>
    </form>
</div>

<div class="bjui-pageContent"  >
    <g:if test="${passRate.size() > 0}">
        <div id="passRate" style="width:100%;height:400px;margin: auto;float:left"></div>
        <script  src="${request.getContextPath()}/js/echarts/echarts.js"></script>
        <script  src="${request.getContextPath()}/js/echarts/echarts-tool.js"></script>
        <script type="text/javascript">
            // 基于准备好的dom，初始化echarts实例
            var contextPath = "${request.getContextPath()}";
            eChartsTool.init(contextPath);
            var data=[];
            var data2=[];
            var legendData = [];
            var seriesData = [];
            var selected = {};

            <g:each in="${passRateByStep}" status="i" var="tableInstance">

            legendData.push("${tableInstance.NAME}");
            seriesData.push({
                name: "${tableInstance.NAME}",
                value: ${tableInstance.VALUE}
            });
            </g:each>
            // 指定图表的配置项和数据
            var option = {
                title : {
                    text: '按工序分析',
                    x:'center',
                    y:'10',
                    "textStyle": {
                        "fontSize": 20
                    }
                },
                tooltip : {
                    trigger: 'item',
                    formatter: "{c} ({d}%)",
                    "textStyle": {
                        "fontSize": 13
                    }
                },
                legend: {
                    orient: 'vertical',
                    data: legendData,


                    x:'60%',
                    y:'center',
                    "textStyle": {
                        "fontSize": 13
                    }
                },
                series : [
                    {
                        type: 'pie',
                        radius : '60%',
                        center: ['35%', '60%'],
                        data:seriesData,
                        itemStyle: {
                            emphasis: {
                                shadowBlur: 10,
                                shadowOffsetX: 0,
                                shadowColor: 'rgba(0, 0, 0, 0.5)'
                            },
                            normal:{
                                label: {
                                    "textStyle": {
                                        "fontSize": 13
                                    }
                                },
                            }
                        }
                    }
                ]
            };
            // 使用刚指定的配置项和数据显示图表。
            eChartsTool.setOption("roma", document.getElementById('passRate'), option);
        </script>
        <div id="passRate1" style="width:100%;height:400px;margin: auto;float:left"></div>
        <script  src="${request.getContextPath()}/js/echarts/echarts.js"></script>
        <script  src="${request.getContextPath()}/js/echarts/echarts-tool.js"></script>
        <script type="text/javascript">
            // 基于准备好的dom，初始化echarts实例
            var contextPath = "${request.getContextPath()}";
            eChartsTool.init(contextPath);
            var data=[];
            var data2=[];
            var legendData = [];
            var seriesData = [];
            var selected = {};

            <g:each in="${passRateByPeople}" status="i" var="tableInstance">

            legendData.push("${tableInstance.NAME}");
            seriesData.push({
                name: "${tableInstance.NAME}",
                value: ${tableInstance.VALUE}
            });
            </g:each>
            // 指定图表的配置项和数据
            var option = {
                title : {
                    text: '按责任人分析',
                    x:'center',
                    y:'10',
                    "textStyle": {
                        "fontSize": 20
                    }
                },
                tooltip : {
                    trigger: 'item',
                    formatter: "{c} ({d}%)",
                    "textStyle": {
                        "fontSize": 13
                    }
                },
                legend: {
                    orient: 'vertical',
                    data: legendData,


                    x:'60%',
                    y:'center',
                    "textStyle": {
                        "fontSize": 13
                    }
                },
                series : [
                    {
                        type: 'pie',
                        radius : '60%',
                        center: ['35%', '60%'],
                        data:seriesData,
                        itemStyle: {
                            emphasis: {
                                shadowBlur: 10,
                                shadowOffsetX: 0,
                                shadowColor: 'rgba(0, 0, 0, 0.5)'
                            },
                            normal:{
                                label: {
                                    "textStyle": {
                                        "fontSize": 13
                                    }
                                },
                            }
                        }
                    }
                ]
            };
            // 使用刚指定的配置项和数据显示图表。
            eChartsTool.setOption("roma", document.getElementById('passRate1'), option);
        </script>
        <div id="passRate2" style="width:100%;height: 400px;float:left" ></div>
        <script  src="${request.getContextPath()}/js/echarts/echarts.js"></script>
        <script  src="${request.getContextPath()}/js/echarts/echarts-tool.js"></script>
        <script type="text/javascript">
            // 基于准备好的dom，初始化echarts实例
            var contextPath = "${request.getContextPath()}";
            eChartsTool.init(contextPath);
            var data=[];
            <g:each in="${onceYieldByStep}" status="i" var="tableInstance">
            data.push('${tableInstance.DESCRIPTION}');
            </g:each>

            // 指定图表的配置项和数据
            var option = {
                /*backgroundColor: 'rgba(0,0,0,0)', // 工具箱背景颜色*/
                // 图表标题
                toolbox: {

                    show: true,

                    feature: {

                        saveAsImage: {

                            show: true,

                            excludeComponents: ['toolbox'],

                            pixelRatio: 2

                        }
                    }

                },
                title : {
                    text: '一次合格率按工序分析',
                    x:'center',
                    y:'10',
                    "textStyle": {
                        "fontSize": 20
                    }
                },

                tooltip : {
                    trigger: ''
                },

                xAxis: {
                    data:data,
                    axisLabel : {//坐标轴刻度标签的相关设置。
                        interval:0,
                        rotate:"45"
                    }
                },
                yAxis : [
                    {
                        type : 'value'
                    },
                    {
                        type : 'value',
                        name:'占比',

                        axisLabel : {
                            formatter: '{value}%'
                        },
                        show:true
                    }
                ],
                series : [
                    {
                        name: '占比',
                        type: 'bar',
                        data:${onceYieldByStep.YIELD}

                    }
                   ]
            };
            // 使用刚指定的配置项和数据显示图表。
            eChartsTool.setOption("roma", document.getElementById('passRate2'), option);
        </script>
        <div id="passRate3" style="width:100%;height: 400px;float:left" ></div>
        <script  src="${request.getContextPath()}/js/echarts/echarts.js"></script>
        <script  src="${request.getContextPath()}/js/echarts/echarts-tool.js"></script>
        <script type="text/javascript">
            // 基于准备好的dom，初始化echarts实例
            var contextPath = "${request.getContextPath()}";
            eChartsTool.init(contextPath);
            var data=[];
            <g:each in="${onceYieldByPeople}" status="i" var="tableInstance">
            data.push('${tableInstance.DESCRIPTION}');
            </g:each>

            // 指定图表的配置项和数据
            var option = {
                /*backgroundColor: 'rgba(0,0,0,0)', // 工具箱背景颜色*/
                // 图表标题
                toolbox: {

                    show: true,

                    feature: {

                        saveAsImage: {

                            show: true,

                            excludeComponents: ['toolbox'],

                            pixelRatio: 2

                        }
                    }

                },
                title : {
                    text: '一次合格率按责任人分析',
                    x:'center',
                    y:'10',
                    "textStyle": {
                        "fontSize": 20
                    }
                },

                tooltip : {
                    trigger: ''
                },

                xAxis: {
                    data:data,
                    axisLabel : {//坐标轴刻度标签的相关设置。
                        interval:0,
                        rotate:"45"
                    }
                },
                yAxis : [
                    {
                        type : 'value'
                    },
                    {
                        type : 'value',
                        name:'占比',

                        axisLabel : {
                            formatter: '{value}%'
                        },
                        show:true
                    }
                ],
                series : [
                    {
                        name: '占比',
                        type: 'bar',
                        data:${onceYieldByPeople.YIELD}

                    }
                ]
            };
            // 使用刚指定的配置项和数据显示图表。
            eChartsTool.setOption("roma", document.getElementById('passRate3'), option);
        </script>
    </g:if>

    <div style="margin:15px auto; width:96%;">
        <div class="row" style="padding: 0px 0px;">
            <div class="col-md-12" >
                <g:if test="${passRate.size() > 0}">
                    <br>
                    <br>
                    <br>
                    <br>
                    <br>

                    <table data-toggle="tablefixed" data-width="100%" data-nowrap="true">
                        <thead>
                            <tr>
                                <g:each in="${tableHeadList}" status="i" var="headInstance">
                                    <g:if test="${headInstance != 'RN'}">
                                        <th><g:message code="${headInstance}" default="${headInstance}"/></th>
                                    </g:if>
                                </g:each>

                            </tr>
                        </thead>
                        <tbody>
                            <g:each in="${passRate}" status="i" var="dataInstance">
                                <tr>
                                    <g:each in="${tableHeadList}" status="j" var="headInstance">
                                        <g:if test="${headInstance != 'RN'}">
                                            <td>${dataInstance["${headInstance}"]}</td>
                                        </g:if>
                                    </g:each>
                                </tr>
                            </g:each>
                        </tbody>
                    </table>
                </g:if>
                <g:else>
                    <g:render template="../template/emptyPanel"/>
                </g:else>
            </div>
        </div>
    </div>
</div>
<g:render template="../template/pagination" />

